<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0,user-scalable=no,minimal-ui">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="../img/asset-favico.ico">
    <title>传智健康</title>
    <link rel="stylesheet" href="../css/page-health-index.css"/>
    <link rel="stylesheet" href="../css/page-health-login.css"/>
    <link rel="stylesheet" href="../plugins/elementui/index.css"/>
    <script src="../plugins/jquery/dist/jquery.min.js"></script>
    <script src="../plugins/healthmobile.js"></script>
    <script src="../plugins/vue/vue.js"></script>
    <script src="../plugins/vue/axios-0.18.0.js"></script>
    <script src="../plugins/elementui/index.js"></script>
    <style>
        .input-with-select .el-input-group__prepend {
            background-color: #fff;
        }

        .el-message {
            min-width: 30px
        }

        .demo-table-expand {
            font-size: 0;
        }

        .demo-table-expand label {
            width: 90px;
            color: #99a9bf;
        }

        .demo-table-expand .el-form-item {
            margin-right: 0;
            margin-bottom: 0;
            width: 50%;
        }
    </style>
</head>
<body data-spy="scroll" data-target="#myNavbar" data-offset="150">
<div class="app">
    <el-container>
        <el-header class="main-header" style="height:20px;width:100%">
            <div class="top-header">
                <span class="f-left"><i class="icon-back"></i></span>
                <span class="center">传智健康</span>
                <span class="f-right"><i class="icon-more"></i></span>
            </div>

        </el-header>

        <el-row >
        <el-main style="height:70%;width:100%;margin-top:50px">
            <div class="contentBox">
                <div class="list-column2" disabled="false" id="contentBox">
                    <template>

                        <el-table
                                :data="tableData"
                                style="height:70%;width: 100%;margin-top:0px">
                            <el-table-column type="expand">
                                <template slot-scope="props">
                                    <el-form label-position="left" inline class="demo-table-expand">
                                        <el-form-item label="昵称">
                                            <span>{{ props.row.member_name }}</span>
                                        </el-form-item>
                                        <el-form-item label="日期">
                                            <span>{{ props.row.messageDate }}</span>
                                        </el-form-item>
                                        <el-form-item label="评价">
                                            <span>{{ props.row.message }}</span>
                                        </el-form-item>
                                    </el-form>
                                </template>
                            </el-table-column>
                            <el-table-column
                                    label="昵称"
                                    prop="member_name">
                            </el-table-column>
                            <el-table-column
                                    label="日期"
                                    prop="messageDate">
                            </el-table-column>
                            <el-table-column
                                    label="评价"
                                    prop="message">
                            </el-table-column>
                        </el-table>
                    </template>
                </div>
            </div>
        </el-main>
        <el-footer>
            <el-button type="primary" size="small" round style="magin-right:0px"><a href="Message_board.html">我也要评论</a></el-button>
        </el-footer>
        </el-row>
    </el-container>
</div>
</body>
<script>
    var vue = new Vue({
        el: '.app',
        data: {
            input:'',
            tableData: [ ]
        },
        methods: {

        },
        mounted() {
            axios.get("/message/findAllMessages").then((res)=>{
                if (res.data.flag){
                    this.tableData=res.data.data;
                } else {
                    this.$message.error(res.data.message);
                }
            })
        }
    })
</script>
</html>